<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<%@ taglib uri="http://www.springframework.org/tags" prefix="s"%>
<%@ taglib uri="http://www.springframework.org/tags/form" prefix="form"%>

<!DOCTYPE html>
<html lang="en">
<head>
<title><s:message code="app.title" /></title>
<%@ include file="Include.jsp"%>
<script type="text/javascript">
	
	$(document).ready(function() {
		$("#jobnoid").focus();	
	});
	
</script>
</head>
<body>
	<div class="container">
		<%@ include file="Menu.jsp"%>
		<h2><s:message code="billofLadingForm.addheader" /></h2>
		<hr>
		<form:form id="cancelForm">
		</form:form>
		<form:form class="form-horizontal" method="post" name="billofLadingForm" id="billofLadingForm" commandName="BillofLadingForm"
	           modelAttribute="billofLadingForm" >
			<s:bind path="*">
				<c:if test="${status.error}">
					<div id="message" class="text-error"><b>Please check your inputs.</b></div>
				</c:if>
			</s:bind>
			<div class="tabbable">  <!-- Only required for left/right tabs -->
				<ul class="nav nav-tabs" class="nav nav-pills">
    				<li class="active"><a href="#tab1" data-toggle="tab">Customer / Overseas Agent Detail</a></li>
    				<li><a href="#tab2" data-toggle="tab">Vessel / Container Detail</a></li>
    				<li><a href="#tab3" data-toggle="tab">Description</a></li>
      				<li><a href="#tab4" data-toggle="tab">Freight / B/L Issue</a></li>
				</ul>
<!-- Tab Div tag Start -->
  			<div class="tab-content">
			<!-- Tab 1 Coding Start -->
    			<div class="tab-pane active" id="tab1">
    				<table class="table table-bordered">
    				<tr>
<%-- 					<th><form:label path="jobregister"><s:message code="billofLadingForm.jobnoid" /></form:label></th> --%>
<!-- 					<td> -->
<%-- 						<form:select path="jobnoid" cssClass="input-large" tabindex="1"> --%>
<%-- 							<form:option value="">- Select -</form:option>  --%>
<%-- 							<form:options items="${jobnoList}" itemLabel="jobno" itemValue="jobnoid" /> --%>
<%-- 						</form:select> --%>
<%-- 						<form:errors cssClass="text-error" path="jobnoid" /> --%>
<!-- 					</td> -->

						<th><form:label path="contactByShipperid"><s:message code="billofLadingForm.shipperid" /></form:label></th>
						<td>
							<form:input path="contactByShipperid" cssClass="input-xlarge" id="contactByShipperid" maxlength="50" size="50" tabindex="2"/>
							<form:errors cssClass="text-error" path="contactByShipperid" />

							<br>

							<form:textarea path="shipperaddress" rows="6" id="shipperaddress" cssClass="input-xlarge"/>
							<form:errors cssClass="text-error" path="shipperaddress" />
						</td>
						<th><form:label path="contactByNotify2id"><s:message code="billofLadingForm.notify2id" /></form:label></th>
						<td>
							<form:input path="contactByNotify2id" cssClass="input-xlarge" id="contactByNotify2id" maxlength="50" size="50" tabindex="2"/>
							<form:errors cssClass="text-error" path="contactByNotify2id" />

							<br>

							<form:textarea path="notify2address" rows="6" id="notify2address" cssClass="input-xlarge"/>
							<form:errors cssClass="text-error" path="notify2address" />
						</td>
					</tr>
					<tr>
						<th><form:label path="contactByConsigneeid"><s:message code="billofLadingForm.consigneeid" /></form:label></th>
						<td>
							<form:input path="contactByConsigneeid" cssClass="input-xlarge" id="contactByConsigneeid" maxlength="50" size="50" tabindex="2"/>
							<form:errors cssClass="text-error" path="contactByConsigneeid" />
	
							<br>
				
							<form:textarea path="consigneeaddress" rows="6" id="consigneeaddress" cssClass="input-xlarge"/>
							<form:errors cssClass="text-error" path="consigneeaddress" />
						</td>
						<th><form:label path="contactByDeliveryagentid"><s:message code="billofLadingForm.deliveryagentid" /></form:label></th>
						<td>
							<form:input path="contactByDeliveryagentid" cssClass="input-xlarge" id="contactByDeliveryagentid" maxlength="50" size="50" tabindex="2"/>
							<form:errors cssClass="text-error" path="contactByDeliveryagentid" />
	
							<br>
	
							<form:textarea path="deliveryagentaddress" rows="6" id="deliveryagentaddress" cssClass="input-xlarge"/>
							<form:errors cssClass="text-error" path="deliveryagentaddress" />
						</td>
					</tr>
					<tr> 
					<th><form:label path="contactByNotify1id"><s:message code="billofLadingForm.notify1id" /></form:label></th>
						<td>
							<form:input path="contactByNotify1id" cssClass="input-xlarge" id="contactByNotify1id" maxlength="50" size="50" tabindex="2"/>
							<form:errors cssClass="text-error" path="contactByNotify1id" />

							<br>

							<form:textarea path="notify1address" rows="6" id="notify1address" cssClass="input-xlarge"/>
							<form:errors cssClass="text-error" path="notify1address" />
						</td>
						<th>
<%-- 						<form:label path="doordelivery"><s:message code="billofLadingForm.doordelivery" /></form:label> --%>

						<label class="checkbox inline">
						<input type="checkbox" id="chkDoorDelivery" value="option1" onchange="javascript: checkDoorDelivery();"> Door Delivery
						</label>
						</th>
						<td>
							<form:textarea path="doordelivery" rows="7" cssClass="input-xlarge" id="doordelivery" tabindex="2" cssStyle="display: none;"/>
							<form:errors cssClass="text-error" path="doordelivery" />
						</td>
					</tr>
					</table>
				</div>
			<!-- Tab 1 Coding End -->
			<!-- Tab 2 Coding Start -->
			<div class="tab-pane" id="tab2">
    			<table class="table table-bordered">
      			<tr>
				<th><form:label path="portByPorid"><s:message code="billofLadingForm.porid" /></form:label></th>
					<td>
						<form:select path="portByPorid" cssClass="input-large" tabindex="1">
							<form:option value="">- Select -</form:option> 
							<form:options items="${portList}" itemLabel="portname" itemValue="portid" />
						</form:select>
						<form:errors cssClass="text-error" path="portByPorid" />
					</td>
				<th><form:label path="portByPodid"><s:message code="billofLadingForm.polid" /></form:label></th>
					<td>
						<form:select path="portByPodid" cssClass="input-large" tabindex="1">
							<form:option value="">- Select -</form:option> 
							<form:options items="${portList}" itemLabel="portname" itemValue="portid" />
						</form:select>
						<form:errors cssClass="text-error" path="portByPodid" />
					</td>
				</tr>
				<tr>
				<th><form:label path="portByPolid"><s:message code="billofLadingForm.podid" /></form:label></th>
					<td>
						<form:select path="portByPolid" cssClass="input-large" tabindex="1">
							<form:option value="">- Select -</form:option> 
							<form:options items="${portList}" itemLabel="portname" itemValue="portid" />
						</form:select>
						<form:errors cssClass="text-error" path="portByPolid" />
					</td>
					<th><form:label path="portByPfdid"><s:message code="billofLadingForm.pfdid" /></form:label></th>
					<td>
						<form:select path="portByPfdid" cssClass="input-large" tabindex="1">
							<form:option value="">- Select -</form:option> 
							<form:options items="${portList}" itemLabel="portname" itemValue="portid" />
						</form:select>
						<form:errors cssClass="text-error" path="portByPfdid" />
					</td>
				</tr>
				<tr>
				<th><form:label path="vesselByLastvslid"><s:message code="billofLadingForm.lastvslid" /></form:label></th>
					<td>
						<form:select path="vesselByLastvslid" cssClass="input-large" tabindex="1">
							<form:option value="">- Select -</form:option> 
							<form:options items="${vesselList}" itemLabel="vesselname" itemValue="vesselid" />
						</form:select>
						<form:errors cssClass="text-error" path="vesselByLastvslid" />
						&nbsp;
						<form:input path="lastvsletd" cssClass="input-small" id="lastvsletd" maxlength="10" size="11" tabindex="2" placeholder="DD/MM/YYYY"/>
						<form:errors cssClass="text-error" path="lastvsletd" />
					</td>
				<th><form:label path="vesselByOnbvslid"><s:message code="billofLadingForm.onbvslid" /></form:label></th>
					<td>
						<form:select path="vesselByOnbvslid" cssClass="input-large" tabindex="1">
							<form:option value="">- Select -</form:option> 
							<form:options items="${vesselList}" itemLabel="vesselname" itemValue="vesselid" />
						</form:select>
						<form:errors cssClass="text-error" path="vesselByOnbvslid" />
						&nbsp;
						<form:input path="onbvsletd" cssClass="input-small" id="onbvsletd" maxlength="10" size="11" tabindex="2" placeholder="DD/MM/YYYY"/>
						<form:errors cssClass="text-error" path="onbvsletd" />
					</td>
				</tr>
				<tr>
				<th><form:label path="noofpackages"><s:message code="billofLadingForm.noofpackages" /></form:label></th>
					<td>
						<form:input path="noofpackages" cssClass="input-mini" id="noofpackages" maxlength="3" size="10" tabindex="2"/>
						<form:errors cssClass="text-error" path="noofpackages" />
						&nbsp;
						<form:select path="codetableByPkgstypeid" cssClass="input-medium" tabindex="1">
							<form:option value="">- Select -</form:option> 
							<form:options items="${pkgstypeList}" itemLabel="formvalue" itemValue="codetableid" />
						</form:select>
						<form:errors cssClass="text-error" path="codetableByPkgstypeid" />
					</td>
				<th><form:label path="cbm"><s:message code="billofLadingForm.cbm" /></form:label></th>
					<td>
						<form:input path="cbm" cssClass="input-medium" id="contactByNotify1id" maxlength="7" size="10" tabindex="2"/>
						<form:errors cssClass="text-error" path="cbm" />
					</td>
				</tr>
				<tr>
				<th><form:label path="grossweight"><s:message code="billofLadingForm.grossweight" /></form:label></th>
					<td>
						<form:input path="grossweight" cssClass="input-medium" id="grossweight" maxlength="12" size="15" tabindex="2"/>
						<form:errors cssClass="text-error" path="grossweight" />
						&nbsp;
						<form:select path="grossweighttype" cssClass="input-small" tabindex="1">
							<form:option value="">- Select -</form:option> 
							<form:options items="${weighttypeList}" itemLabel="formvalue" itemValue="codetableid" />
						</form:select>
						<form:errors cssClass="text-error" path="grossweighttype" />
					</td>
				<th><form:label path="netweight"><s:message code="billofLadingForm.netweight" /></form:label></th>
					<td>
						<form:input path="netweight" cssClass="input-medium" id="netweight" maxlength="12" size="15" tabindex="2"/>
						<form:errors cssClass="text-error" path="netweight" />
						&nbsp;
						<form:select path="netweighttype" cssClass="input-small" tabindex="1">
							<form:option value="">- Select -</form:option> 
							<form:options items="${weighttypeList}" itemLabel="formvalue" itemValue="codetableid" />
						</form:select>
						<form:errors cssClass="text-error" path="netweighttype" />
					</td>
				</tr>
				<tr>
				<th><form:label path="codetableByDoctypeid"><s:message code="billofLadingForm.doctypeid" /></form:label></th>
					<td>
						<form:select path="codetableByDoctypeid" cssClass="input-medium" tabindex="1">
							<form:option value="">- Select -</form:option> 
							<form:options items="${doctypeList}" itemLabel="formvalue" itemValue="codetableid" />
						</form:select>
						<form:errors cssClass="text-error" path="codetableByDoctypeid" />
					</td>
				<th><form:label path="codetableByLclfclid"><s:message code="billofLadingForm.lclfclid" /></form:label></th>
					<td>
						<form:select path="codetableByLclfclid" cssClass="input-medium" tabindex="1">
							<form:option value="">- Select -</form:option> 
							<form:options items="${modeList}" itemLabel="formvalue" itemValue="codetableid" />
						</form:select>
						<form:errors cssClass="text-error" path="codetableByLclfclid" />
					</td>
				</tr>
				</table>
				<!-- Start Shippingbill Table's Code -->
				<table class="table table-hover table-bordered" id="shippingBillTable">
				<thead>
					<tr>
						<th><s:message code="shippingBillForm.sbillno" /></th>
						<th><s:message code="shippingBillForm.sbilldate" /></th>
						<th><s:message code="shippingBillForm.noofpackages" /></th>
						<th><s:message code="shippingBillForm.grossweight" /></th>
						<th><s:message code="shippingBillForm.netweight" /></th>
						<th><s:message code="shippingBillForm.containerno" /></th>
						<th><s:message code="shippingBillForm.customsealno" /></th>
						<th><s:message code="shippingBillForm.agentsealno" /></th>
					</tr>
				</thead>
				<!-- End Shippingbill Table's Code -->
				</table>
			</div>
			<!-- Tab 2 Coding End -->
			<!-- Tab 3 Coding Start -->
			<div class="tab-pane" id="tab3">
    			<table class="table table-bordered">
    			<tr>
					<th width="10%"><form:label path="marksandno"><s:message code="billofLadingForm.marksandno" /></form:label></th>
					<th width="*"><form:label path="description"><s:message code="billofLadingForm.description" /></form:label></th>
    			</tr>
    			<tr>
	    			<td width="10%">	
						<form:textarea path="marksandno" rows="23" cssClass="input-xlarge" id="marksandno" tabindex="2"/>
						<form:errors cssClass="text-error" path="marksandno" />
					</td>
					<td width="*">
						<form:textarea path="description" rows="23" cssClass="input-desclarge" id="description" tabindex="2"/>
						<form:errors cssClass="text-error" path="description" />
					</td>
    			</tr>
    			</table>
    		</div>
    		<!-- Tab 3 Coding End -->
    		<!-- Tab 4 Coding Start -->
			<div class="tab-pane" id="tab4">
    			<table class="table table-bordered">
    			<tr>
    			<th><form:label path="codetableByFreightstatusid"><s:message code="billofLadingForm.freightstatusid" /></form:label></th>
					<td>
						<form:select path="codetableByFreightstatusid" cssClass="input-medium" tabindex="1">
							<form:option value="">- Select -</form:option> 
							<form:options items="${freightstatusList}" itemLabel="formvalue" itemValue="codetableid" />
						</form:select>
						<form:errors cssClass="text-error" path="codetableByFreightstatusid" />
					</td>
    			<th><form:label path="freightpayableto"><s:message code="billofLadingForm.freightpayableto" /></form:label></th>
    			<td>
						<form:select path="freightpayableto" cssClass="input-medium" tabindex="1">
							<form:option value="">- Select -</form:option> 
<%-- 							<form:options items="" itemLabel="Ahmedabad" itemValue="1" /> --%>
<%-- 							<form:options items="" itemLabel="Baroda" itemValue="2" /> --%>
						</form:select>
						<form:errors cssClass="text-error" path="freightpayableto" />
					</td>
    			</tr>
    			<tr>
    			<th><form:label path="codetableByNooforignalbl"><s:message code="billofLadingForm.nooforignalbl" /></form:label></th>
					<td>
						<form:select path="codetableByNooforignalbl" cssClass="input-medium" tabindex="1">
							<form:option value="">- Select -</form:option> 
							<form:options items="${noofblList}" itemLabel="formvalue" itemValue="codetableid" />
						</form:select>
						<form:errors cssClass="text-error" path="codetableByNooforignalbl" />
					</td>
    			<th><form:label path="placeofissue"><s:message code="billofLadingForm.placeofissue" /></form:label></th>
					<td>
						<form:input path="placeofissue" cssClass="input-large" id="placeofissue" maxlength="25" size="30" tabindex="2" placeholder="AHMEDABAD DT : DD/MM/YYYY"/>
						<form:errors cssClass="text-error" path="placeofissue" />
					</td>
    			</tr>
    			<tr>
					<td>
					<label class="checkbox inline">
						<input type="checkbox" id="blsurrendred" value="option1"> B/L Surrendred
					</label>
					</td>
					<td>
					<label class="checkbox inline">
						<input type="checkbox" id="printcbminbl" value="option2"> Print CBM in B/L
					</label>
					</td>
					<td>
					<label class="checkbox inline">
						<input type="checkbox" id="printcontaineridbl" value="option3"> Print Container in B/L
					</label>
					</td>
					<td>
					<label class="checkbox inline">
						<input type="checkbox" id="receivedforshipment" value="option4"> Received For Shipment (RFS) B/L 
					</label>
					</td>
    			</tr>
    			</table>
    		</div>
    		<!-- Tab 4 Coding End -->
	</div>
	<!-- Tab Div tag End -->
</div>
			<button class="btn btn-primary" type="submit" formaction="AddBilloflading" formmethod="post" tabindex="7"><s:message code="app.add" /></button>
			&nbsp;
			<button class="btn btn-info" type="submit" formmethod="get"><s:message code="app.print" /></button>
			&nbsp;
			<button class="btn" type="submit" formaction="AddFCLDatemanager" form="cancelForm" formmethod="get" tabindex="8"><s:message code="app.cancel" /></button>
		</form:form>
	</div>
</body>
</html>